// 用户模块
import { userAccountLogin } from '@/api/user'
const user = {
  namespaced: true,
  // 定义数据
  // state:()=>({})  ？
  // state: {}

  // 组件的data选项必须是一个函数？
  // 原因: 组件本质为了复用 复用组件的时候要保证组件内部的数据是互相独立的不影响
  // 为了保证数据独立 必须是一个函数 每次复用组件都会调用函数 每次调用函数都会
  // 生成一份独立无二的内存空间 各个复用的组件就数据互相独立了

  // js底层机制：函数每次调用return出来的对象会生成一块全新的内存 虽然初始值看起来一样 但是互相不影响

  // state: 为什么要写成函数 ? 复用的时候数据互相不影响
  // state: {}  项目不够大 不需要复用 定义普通对象没有问题

  // 为什么是 state:() => ({})
  // 当函数中只有一个返回值的时候 可以省略return
  // 加括号的目的 仅仅是为了包裹一下变成表达式 就没有语法错误了
  // state:()=>{ return {} }

  // 总结：写函数return对象的应用 vue data / state / props: 默认参数 复杂类型 必须是一个工厂函数
  // 都是为了保证复用的时候数据互相独立 不影响 底层js机制都是一样的
  state: () => ({
    profile: {
      id: '',
      account: '',
      nickname: '',
      avatar: '',
      token: '',
      mobile: ''
    }
  }),
  // 定义修改数据的方法
  mutations: {
    setProfile (state, useInfo) {
      state.profile = useInfo
    },
    // 清除数据
    clearProfile (state) {
      state.profile = {}
    }
  },
  // 定义异步方法
  actions: {
    async doLogin (ctx, { account, password }) {
      // 发送登录请求
      const res = await userAccountLogin({ account, password })
      // 调用mutation存入数据
      ctx.commit('setProfile', res.data.result)
    }
  },
  // 基于state的计算属性
  getters: {}

}

export default user
